@import './tab-nav.scss';

.vxp-tabs {
  @include basis;

  position: relative;
  overflow: hidden;

  &__header {
    margin-bottom: 0.8em;
  }

  &__main {
    position: relative;
    display: flex;
    transition: $vxp-transition-transform-base;

    &--transition {
      pointer-events: none;
      user-select: none;

      %pane {
        visibility: visible;
      }
    }
  }

  &__pane {
    flex-shrink: 0;
    width: 100%;
    visibility: hidden;

    &--active {
      visibility: visible;
    }
  }
}
